import React, { Component } from 'react'
import './index.css'

export default class Show extends Component {

    state = {
        userInfo: [
            {id: '001', userImg: '/logo192.png', userName: '张三'},
            {id: '002', userImg: '/logo192.png', userName: '李四'},
            {id: '003', userImg: '/logo192.png', userName: '王五'},
            {id: '004', userImg: '/logo192.png', userName: '福来'},
            {id: '005', userImg: '/logo192.png', userName: '德华'}
        ]
    }

    render() {
        const {userInfo} = this.state
        return (
            <div className="userContainer">
                {
                    userInfo.map(item => (
                        <div className="userItem" key={item.id}>
                            <div className="userImg">
                                <img src={item.userImg} alt="headPortrait"/>
                            </div>
                            <div className="userName">
                                {item.userName}
                            </div>
                        </div>
                    ))
                }
            </div>
        )
    }
}
